<template>
  <div class="container">
    <div class="box">
      <div class="content">
         <router-view></router-view>
      </div>
    </div>
   <Footer/>
  </div>
</template>

<script>
import Footer from './components/Footer'
export default {
  components: {
    Footer
  }
}
</script>
<style lang="scss">
body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select,td{margin:0;padding:0;}
// body{font:.12rem  "宋体"; word-wrap:break-word;}
html{font-size:26.666666666vw}
a,u,s,del{color:#666;text-decoration:none}
fieldset ,a img,.bor0 {border:0;}
i,em,b{font-style:normal;font-weight:100;}
li{list-style:none;}
img{vertical-align:middle;}
table{border-collapse:collapse;}
textarea{resize:none;}

html,body,.container{
  width: 100%;
  height:100%
}
.container{width: 100%;height:100%}
.ind2{text-indent:2em;}

/*溢出隐藏出现省略号*/
.over{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/*图片水平垂直居中*/
.valign{text-align:center;}
.valign img{vertical-align:middle;}
.valign:after{content:"";display:inline-block;vertical-align:middle;height:100%;}

/*解决margin-top向上传递问题*/
.clear:before{content:"";display:table;}
/*清除浮动*/
.clear:after{content:"";clear:both;display:block;}

.container {
  display: flex;
  flex-direction: column;
  font-size: 12px;
  .box {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: auto;
    .header {
      height:.44rem;
      background-color: #f99;
    }
    .content {
      flex: 1;
      overflow: auto;
    }
  }
  footer{
    height: .5rem;
  }
}
</style>
